<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.w3.org/1999/xhtml">

<head>
    <th:block th:include="common/common_head :: commonHeader('品质异常单详情')"/>
    <link th:href="@{/static/css/plugins/cropper/cropper.min.css}"
          rel="stylesheet">
    <style type="text/css">
        #formTable td {
            padding: 0px;
            text-align: center;
            line-height: 34px;
            font-size: 14px;

        }

        #formTable input {
            background-color: white;
        }

        #formTable {
            width: 76%;
            margin: auto;

        }


    </style>

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <form class="form-horizontal" method="post" id="abnormalForm">
            <table width="74%" class="layui-table" id="formTable">
                <tr>
                    <th height="30px" valign="middle" colspan="11"
                        style="text-align: center; vertical-align: middle; font-size: 21px;color: black">
                        <div style="position: absolute; width: 68px; height: 58px; margin-left: 10%; margin-top:8px;">
                            <img alt="" th:src="@{/static/img/hsicon.png}"></div>
                        <div style="margin-top:25px"> 品 质 异 常 处 理 单</div>
                        <input th:value="${abnormalQuality.pkId}" style="display: none" name="pkId" id="pkId"/>
                        <input th:value="${editor}" style="display: none" id="editor"/>
                        <div style="margin-left: 80% ;font-size: 15px;margin-top: 18px"> 表单编号：
                            <span th:text="${abnormalQuality.formCode}" style="width:140px;height: 24px"></span>
                        </div>

                    </th>
                </tr>
                <tr>
                    <td>责任单位：</td>
                    <td><input name="vendorCode" readonly th:value="${abnormalQuality.vendorCode}"
                               style="border: none;"></td>
                    <td>物料：</td>
                    <td colspan="2"><span th:text="${abnormalQuality.materialCode}"></span></td>
                    <td>发文者：</td>
                    <td colspan="2"><span th:text="${abnormalQuality.submit}"></span></td>
                    <td>发文日期：</td>
                    <td colspan="2"><span th:text="${#dates.format(abnormalQuality.submitDate,'yyyy-MM-dd')}"></span>
                    </td>
                </tr>
                <tr>
                    <td colspan="2"><input name="vendorName" readonly th:value="${abnormalQuality.vendorName}"
                                           style="border: none;width: 100%;text-align: center;"></td>
                    <td>物料描述</td>
                    <td colspan="4"><span th:text="${abnormalQuality.materialDesc}"></span></td>
                    <td>采购组</td>
                    <td colspan="3"><span th:text="${abnormalQuality.cgz}"></span></td>
                </tr>
                <tr>
                    <td colspan="2" rowspan="2">D1.小组成员</td>
                    <td colspan="9"><input id="teamMember" class="vendor form-control" name="teamMember"
                                           autocomplete="off" th:text="${abnormalQuality.teamMember}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>组长</td>
                    <td colspan="2"><input id="teamLeader" class="vendor form-control" name="teamLeader"
                                           autocomplete="off" th:text="${abnormalQuality.teamLeader}"></td>
                </tr>
                <tr>
                    <td colspan="2">D2.问题点描述</td>
                    <td colspan="9"><textarea class="form-control" rows="5" readonly style="resize:none;"
                                              th:text="${abnormalQuality.description}"></textarea>
                    </td>
                </tr>
                <tr>
                    <td width="9%">收获日期</td>
                    <td width="9%">采购凭证</td>
                    <td width="9%">供应商批次</td>
                    <td width="9%">厚声批次</td>
                    <td width="9%">缺陷项目</td>
                    <td width="9%">缺陷分类</td>
                    <td width="9%">不良率</td>
                    <td width="9%">不良数量</td>
                    <td width="9%">进科数量</td>
                    <td width="9%">厚声处理要求</td>
                    <td width="9%">备注</td>
                </tr>
                <tr>
                    <td><span th:text="${#dates.format(abnormalQuality.receiveDate,'yyyy-MM-dd')}"></span></td>
                    <td><span th:text="${abnormalQuality.purchaseVoucher}"></span></td>
                    <td><span th:text="${abnormalQuality.vendorBatch}"></span></td>
                    <td><span th:text="${abnormalQuality.hsBatch}"></span></td>
                    <td><span th:text="${abnormalQuality.defectiveItem}"></span></td>
                    <td><span th:text="${abnormalQuality.detectiveSort}"></span></td>
                    <td><span th:text="${abnormalQuality.defectRate}"></span></td>
                    <td><span th:text="${abnormalQuality.defectNumber}"></span></td>
                    <td><span th:text="${abnormalQuality.feedNumber}"></span></td>
                    <td><span th:text="${abnormalQuality.processDemand}"></span></td>
                    <td><span th:text="${abnormalQuality.remark}"></span></td>
                </tr>
                <tr>
                    <td>要求</td>
                    <td colspan="10"><span th:text="${abnormalQuality.require}"></span></td>
                </tr>
                <tr>
                    <td colspan="2">供应商上传附件</td>
                    <td colspan="9">
                        <input name="attach" type="file" th:if="${editor=='vendor'}">
                        <a id="vendorAttch" th:text="${abnormalQuality.vendorAttach}"
                           th:value="${abnormalQuality.pkId}" onclick="dowloadFileById(this)"
                           style="color: blue"></a>
                    </td>
                </tr>
                <tr>
                    <td rowspan="2" colspan="2">D3原因分析（按5w要求）</td>
                    <td colspan="5"><textarea class="vendor form-control" name="d3Analyze" rows="4" maxlength="300"
                                              style="resize:none;" th:text="${abnormalQuality.d3Analyze}"></textarea>
                    </td>
                    <td>要求完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d3DemandDate" id="d3DemandDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d3DemandDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d3RealDate" id="d3RealDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d3RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>负责人</td>
                    <td><input class="vendor form-control" name="d3Fzr" autocomplete="off"
                               th:value="${abnormalQuality.d3Fzr}"></td>
                </tr>
                <tr>
                    <td rowspan="2" colspan="2">D4不良品外流原因</td>
                    <td colspan="5"><textarea class="vendor form-control" name="d4Outflow" rows="4" maxlength="300"
                                              style="resize:none;" th:text="${abnormalQuality.d4Outflow}"></textarea>
                    </td>
                    <td>要求完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d4DemandDate" id="d4DemandDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d4DemandDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d4RealDate" id="d4RealDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d4RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>负责人</td>
                    <td><input class="vendor form-control" name="d4Fzr" autocomplete="off"
                               th:value="${abnormalQuality.d4Fzr}"></td>
                </tr>
                <tr>
                    <td rowspan="2" colspan="2">D5短期对策</td>
                    <td colspan="5"><textarea class="vendor form-control" name="d5CurrPlan" rows="4" maxlength="300"
                                              style="resize:none;" th:text="${abnormalQuality.d5CurrPlan}"></textarea>
                    </td>
                    <td>要求完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d5DemandDate" id="d5DemandDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d5DemandDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d5RealDate" id="d5RealDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d5RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>负责人</td>
                    <td><input class="vendor form-control" name="d5Fzr" autocomplete="off"
                               th:value="${abnormalQuality.d5Fzr}"></td>
                </tr>

                <tr>
                    <td rowspan="2" colspan="2"> D6长期对策</td>
                    <td colspan="5"><textarea class="vendor form-control" name="d6LongPlan" rows="4" maxlength="300"
                                              style="resize:none;" th:text="${abnormalQuality.d6LongPlan}"></textarea>
                    </td>
                    <td>要求完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d6DemandDate" id="d6DemandDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d6DemandDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="vendor form-control lay-date" name="d6RealDate" id="d6RealDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d6RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>负责人</td>
                    <td><input class="vendor form-control" name="d6Fzr" autocomplete="off"
                               th:value="${abnormalQuality.d6Fzr}"></td>
                </tr>
                <tr>
                    <td rowspan="2" colspan="2">D7改善效果追踪</td>
                    <td colspan="5"><textarea class="sqe form-control" name="d7ResultTrack" rows="4" maxlength="300"
                                              style="resize:none;"
                                              th:text="${abnormalQuality.d7ResultTrack}"></textarea>
                    </td>
                    <td>计划完成时间</td>
                    <td><input class="sqe form-control lay-date" name="d7PlanDate" id="d7PlanDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d7PlanDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="sqe form-control lay-date" name="d7RealDate" id="d7RealDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d7RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>QE主管</td>
                    <td><input class="sqe form-control" name="d7Director" autocomplete="off"
                               th:value="${abnormalQuality.d7Director}"></td>
                </tr>

                <tr>
                    <td rowspan="2" colspan="2"> D8标准化作业培训</td>
                    <td colspan="5"><textarea class="sqe form-control" name="d8StandardWork" rows="4" maxlength="300"
                                              style="resize:none;"
                                              th:text="${abnormalQuality.d8StandardWork}"></textarea>
                    </td>
                    <td>计划完成时间</td>
                    <td><input class="sqe form-control lay-date" name="d8PlanDate" id="d8PlanDate"
                               autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d8PlanDate,'yyyy-MM-dd')}"></td>
                    <td>实际完成时间</td>
                    <td><input class="sqe form-control lay-date" name="d8RealDate" id="d8RealDate" autocomplete="off"
                               th:value="${#dates.format(abnormalQuality.d8RealDate,'yyyy-MM-dd')}"></td>
                </tr>
                <tr>
                    <td colspan="7"></td>
                    <td>QE主管</td>
                    <td><input class="sqe form-control" name="d8Director" autocomplete="off"
                               th:value="${abnormalQuality.d8Director}"></td>
                </tr>
            </table>
            <div class="form-group" style="text-align: center;margin: 10px;">
                <div class="opt">
                    <div class="sqe form-control" style="margin: 10px auto;width: 77%;height:80px;"
                         shiro:hasPermission="abnormal:audit">
                        <label class="control-label"><span class="required-sign">*</span>审核结论：</label>
                        <select id="auditResult" name="auditResult"
                                style="width: 100px; height: 20px;margin-right: 20px;" required>
                            <option></option>
                            <option value="2">通过</option>
                            <option value="-1">驳回</option>
                        </select>
                        <div id="commentDiv" style="display: none">
                            <span><span class="required-sign">*</span>驳回原因：</span>
                            <textarea id="auditComment" name="auditComment" rows="2" cols="80" style="resize: none"
                                      maxlength="300"></textarea>
                        </div>
                    </div>
                    <input class="btn btn-primary" type="button" onclick="save()" value="保存"/>
                    <button class="btn btn-default" type="button" onclick="Dialog.closeFrame(window.name)">取 消</button>
                </div>
            </div>
        </form>
    </div>
</div>

<!--引入公共js-->
<div th:include="common/onload_js :: onloadJS"></div>
<!-- Chosen -->
<script th:src="@{/static/js/plugins/chosen/chosen.jquery.js}"></script>
<script>

    $(function () {
        // 初始化时间插件
        $(".lay-date").each(function () {
            laydate.render({elem: this});
        });
        let editor = $("#editor").val();
        //当前编辑人是供应商
        if (editor == "vendor") {
            $(".vendor").each(function () {
                $(this).prop("required", true);
            })

            $(".sqe").each(function () {
                $(this).prop("disabled", true);
            })
            //小组成员、组长非必填
            $("#teamLeader").prop("required", false);
            $("#teamMember").prop("required", false);
        } else {//当前编辑人是SQE
            $(".sqe").each(function () {
                $(this).prop("required", true);
            })

            $(".vendor").each(function () {
                $(this).prop("disabled", true);
            })
        }

        //选择驳回，D7/D8非必填，填写驳回原因
        $("#auditResult").change(function () {
            //选择驳回
            if ($(this).val() == -1) {
                $(".sqe").each(function () {
                    $(this).prop("required", false);
                    $(this).prop("disabled", true);
                    $(this).val(null);
                })
                //显示文本框输入驳回原因
                $('#commentDiv').css("display", "inline-block");
                $('#auditComment').prop("required", true);
            } else {
                //关闭驳回文本框，清空数据
                $('#commentDiv').css("display", "none");
                $('#auditComment').prop("required", false);
                $('#auditComment').val(null);
                //D7/D8必填
                $(".sqe").each(function () {
                    $(this).prop("required", true);
                    $(this).prop("disabled", false);
                })
            }


        })
    });

    function save() {
        if ($("#abnormalForm").valid()) {
            let editor = $("#editor").val();
            let url = '';
            //当前编辑人是供应商
            if (editor == "vendor") {
                url = ctxPath + "/abnormalQuality/saveEdit";
            } else {//当前编辑人是SQE
                url = ctxPath + "/abnormalQuality/saveAudit";
            }
            var formData = new FormData($('#abnormalForm')[0]);
            layer.load(1, {shade: [0.3, '#393D49']});
            $.ajax({
                url: url,
                type: 'POST',
                data: formData,
                dataType: 'JSON',
                cache: false,
                processData: false,
                contentType: false,
                success: function (data) {
                    layer.closeAll();
                    if (data.code == 0) {
                        Dialog.msg("操作成功!");
                        parent.refresh();
                        Dialog.closeFrame(window.name);
                    } else {
                        Dialog.errorMsg("操作失败，请重试!");
                    }
                }
            });
        }
    }

    /**
     **根据pkid下载报告文件
     **
     **/
    function dowloadFileById(obj) {
        var id = $(obj).first().attr("value");
        window.location.href = ctxPath + "/abnormalQuality/downloadVendorFileById?id=" + id;
    }

    //附件名称截取
    $(function () {
        var vendor = $("#vendorAttch").text();
        sub(vendor, vendorAttch);
    });

    //截取文件名称
    function sub(sqe, selector) {
        var suffix = sqe.substr(sqe.lastIndexOf("."));
        var prefix = sqe.substring(0, sqe.indexOf("_")).trim();
        prefix = prefix.substr(sqe.lastIndexOf("/") + 1);
        var attach = prefix + suffix;
        $(selector).text(attach);
    }
</script>


</body>
</html>
